$(function() {
    class XR {
        constructor(type) {
            this.str2 = "";
            this.typeId = type;
            this.j = 0;
            this.length_x = 0;
            this.ul_length = $(".goods_num_list").children().length
        }
        rendering(str, length) {
            // console.log(this.str2);
            let json = JSON.parse(str)
            let str1 = ``
                // let max = $(".goods_num_list").children().length
            for (let i = this.j; i < length; i++) {
                str1 += `<li class="id_${json[i].goodsId}">
                <a href="#"><img src="${json[i].goodsImg}"></a>
                <a href="#">${json[i].goodsDesc}</a>
                <p><span>会员价</span><span>￥${json[i].goodsPrice}</span></p>
                <p><span>已售出：</span><span>${json[i].goodsCount}</span><img src="../img/Product_page/ping.jpg" alt=""><span>${json[i].beiyong1}</span>条</p>     
                </li>`
            }
            $(".goods_num_list").html("")
            $(".goods_num_list").html(`${str1}`)
        }
        getNweList() {
            let that = this
            $.get("../php/goodsAndShoppingCart/getGoodsListNew.php", {
                "typeId": `${that.typeId}`,
                "count": 6
            }, function(resText) {
                that.getNwe(resText)
            }, 'json')
        }
        getNwe(data) {
            console.log(data);
            let li = ``
            for (let i = 0; i < data.length; i++) {
                li += `<li>
                <img src="${data[i].goodsImg}" alt="">
                <a href="#">${data[i].goodsDesc}</a>
                <span>￥${data[i].goodsPrice}</span>
                <p>已售出<span>${data[i].goodsCount}</span>件</p>
                <div class="flot"><img src="../img/Product_page/paihan${i+1}.png" alt=""></div>
            </li>`
            }
            $(".ranking").next().html(`${li}`)
        }
        getResTxet(id) {
            let that = this
            $.get("../php/goodsAndShoppingCart/getGoodsList.php", {
                "typeId": `${id}`,
            }, function(resText, status) {
                if (status.trim() == "success") {
                    that.str2 = resText;
                    let max = $(".goods_num_list").children().length
                    that.rendering(that.str2, max)
                }
            })
        }
        setid() {
            let json = JSON.parse(this.str2)
                // let li_length = $(".goods_num_list").children().length
            let num = json.length % this.ul_length
            if (num == json.length) {
                this.rendering(this.str2, num)
            }
            let nums = json.length - this.ul_length * this.length_x
            if (nums >= 0) {
                nums = this.ul_length;
            } else if (nums < 0) {
                nums = json.length - (this.ul_length * (this.length_x - 1)) + this.ul_length

            }

            this.rendering(this.str2, nums)
        }
        click() {
            let that = this
            $(".Cards").click(function(e) {
                e.preventDefault();
                let num = $(this).html();
                that.length_x = num
                that.j = 20 * (num - 1);
                // debugger
                that.setid()
                    // debugger
                $(this).addClass("defaults").parent().siblings().children("a").removeClass("defaults")
            })
        }
        eventbild() {
            let that = this
            this.getNweList()
            this.getResTxet(this.typeId)
            this.click()
            $(".SelectPageCard").children().eq(1).click(function() {
                that.length_x = that.length_x - 1
                that.j = 20 * (that.length_x - 1);
                that.setid()

            })
            $(".SelectPageCard").children().eq(7).click(function() {
                that.length_x = that.length_x + 1
                that.j = 20 * (that.length_x - 1);
                that.setid()
            })
        }
    }
    let type = location.search.slice(1)
    let xr = new XR(type);
    xr.eventbild();
    $(".first").children().mouseenter(function() {
        $(this).children("div").show(20).css({
            position: "absolute",
            top: 36,
            left: 68
        })
    }).mouseleave(function() {
        $(this).children("div").hide()
    })

    // 跳转到详情页
    $(".goods_num_list").on("click", "li", function() {
        // console.log($(this).children("a"));
        // $(this).children("a").preventDefault();
        let id = $(this).attr("class").slice(3);
        location.href = `Details_page.html?${id}`

    })

})